<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="./css/chat.css">
    <link rel="stylesheet" href="./css/basic.css">
    <title>木之韵商城用户交流中心</title>
</head>

<body>
    <div id="all">
        <div class="header">
            <p>木之韵商城用户交流中心</p>
            <h6>木之韵商城用户交流中心</h6>
            <div class="welcome">
                <img src="./imgs/index_03.png">
                <span>欢迎您：admin ! </span>
                <img src="./imgs/index_05.png">
                <a href="./index.html">退出</a>
            </div>

        </div>
        <div class="header-border">

        </div>
        <div class="main">
            <div class="main-left">
                <div class="nav-a">
                    <div></div><img src="./imgs/index_36.png">
                </div>
                <div class="nav-b">
                    <span>对话列表</span>
                    <img src="./imgs/index_50.png">
                </div>
                <ul class="nav-c">
                    <li><img src="./imgs/index_03.png"> <span>用户一</span></li>
                    <li><img src="./imgs/index_03.png"> <span>用户二</span></li>
                    <li><img src="./imgs/index_03.png"> <span>用户三</span></li>
                    <li><img src="./imgs/index_03.png"> <span>用户四</span></li>
                </ul>
            </div>
            <div class="main-right">
                <iframe src="./php/client.php"></iframe>
            </div>
        </div>

    </div>
</body>
<script src="./js/lib/jquery-1.8.3.js"></script>
<script>
// 获取cookie
var getCookie = function getCookie(key) {
    var arr1 = document.cookie.split('; ')
    //["user1=111asdasd", "user2=222gfhft", "user3=333wwwaa"]
    for (var i = 0; i < arr1.length; i++) {
        var arr2 = arr1[i].split('=') //['user1','111asdasd']
        if (arr2[0] === key) {
            // 对数据进行解码并返回
            return unescape(arr2[1])
        }
    }
    return null
}
window.onload = function(){
//判断是否登录成功
if(getCookie("username")&&getCookie("loginsucess")=="true"){
    var str = '欢迎您：'+ getCookie("username") +'!' 
    $('.welcome span').html(str)
}
}
$.post('./php/chat.php',{
    name:getCookie("username"),
    way:'f5'
},function(data){
    if(!data[0]){
        return
    }
    data=$.parseJSON( data )
var message = data.info
$('.nav-c').html('')
var str = ''
for(var i=0;i<message.length;i++){
    str +=`
    <li><img src="./imgs/index_03.png"> <span>${message[i]['name']}</span></li>
    `
}
$('.nav-c').html(str)
});
$('.nav-c').on("click","li",function(e){
    //事件对象
    var e = e || window.event;
    //事件目标
    var target = e.target || e.srcElement;
    var peoplename = this.children[1].innerHTML

$.post('./php/chat.php',{
name:getCookie("username"),
way:'talk',
peoplename : peoplename
},function(data){
    data=$.parseJSON( data )
var url='./php/client.php?from='+data[0]+'&to='+data[1]
$('.main-right iframe').attr('src',url)
});
})
</script>
</html>